<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script rel="script" src="/js/nav.js"></script>
  <script rel="script" src="/js/productAdd.js"></script>
  <link rel="stylesheet" href="/css/nav.css">
  <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
  <link href="/css/bootstrap.css" rel="stylesheet">
  <link href="/css/layui.css" rel="stylesheet">
  <link href="/css/public.css" rel="stylesheet">
  <link href="/css/null.css" rel="stylesheet">
  <script src="/js/bootstrap.min.js"></script>
  <link href="/css/search.css" rel="stylesheet">
</head>
<body>
<!--宠物商店管理系统页面-->
<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">宠物商店管理系统</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <!--            <ul class="nav navbar-nav">-->
      <!--                <li class="active"><a href="#">书籍 <span class="sr-only">(current)</span></a></li>-->
      <!--                <li><a href="#">作者</a></li>-->
      <!--                <li class="dropdown">-->
      <!--                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">更多 <span class="caret"></span></a>-->
      <!--                    <ul class="dropdown-menu">-->
      <!--                        <li><a href="#">社区</a></li>-->
      <!--                        <li><a href="#">聊天室</a></li>-->
      <!--                        <li><a href="#">娱乐中心</a></li>-->
      <!--                        <li role="separator" class="divider"></li>-->
      <!--                        <li><a href="#">轻松一刻</a></li>-->
      <!--                        <li role="separator" class="divider"></li>-->
      <!--                        <li><a href="#">商务合作</a></li>-->
      <!--                    </ul>-->
      <!--                </li>-->
      <!--            </ul>-->
      <!--            <form class="navbar-form navbar-left">-->
      <!--                <div class="form-group">-->
      <!--                    <input type="text" class="form-control" placeholder="用户名">-->
      <!--                </div>-->
      <!--                <button type="submit" class="btn btn-default">login</button>-->
      <!--            </form>-->
      <ul class="nav navbar-nav navbar-right">
        <!--                <li><a href="#">godlover</a></li>-->
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">更多操作 <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">修改用户头像</a></li>
            <li><a href="#">修改用户密码</a></li>
            <li><a href="#">修改个人信息</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">注销</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
<div class="content">
  <div class="content-left">
    <!--分割线设置-->
    <div class="seg"></div>
    <!--菜单栏导航-->
    <div class="nav">
      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">大类管理</div>
        <!--子标题-->
        <div class="nav-content" >
          <a href="/ManageQueryAll">大类管理</a>
        </div>
      </div>
      +

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">小类管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/product">小类管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">商品管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/displayItem">商品管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">订单管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/orderIndex">订单管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">库存管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/inventory">库存管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">用户喜好管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="displayProfile">用户喜好管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">供应商管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="displaySupplier">供应商管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">用户管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/UserManageIndex">用户管理</a>
        </div>
      </div>

      <!--每一个菜单栏项-->
      <div class="nav-menu">
        <!--主标题-->
        <div class="nav-title">管理员管理</div>
        <!--子标题-->
        <div class="nav-content">
          <a href="/adminManageIndex">管理员管理</a>
        </div>
      </div>
    </div>
    <!--分割线设置-->
    <div class="seg"></div>
  </div>

  <div class="content-right">
    <div class="container" id="orign">
      <div class="row">
        <div class="col-md-10">
          <div class="panel panel-primary">
            <div class="panel-heading clearfix">
              <nobr>
                小类管理
<!--                <h3 class="panel-title"  style="word-wrap: break-word" th:if="!${#strings.isEmpty(session.msg)}" >订单管理<span class="glyphicon glyphicon-leaf pull-right"><img src="/images/favicon.ico"/></span></h3>-->
              </nobr>
            </div>
            <div class="panel-body">
              <a href="#" class="btn btn-success" id="orderNew">新增</a>
              <!--搜索部分-->
              <form class="form-inline pull-right" method="post" th:action="@{productSearch}">
                <div class="form-group">
                  <div class="input-group">
                    <input type="text" class="form-control" id="keyword" name="keyword" placeholder="关键字">
                  </div>
                </div>
                <button type="submit" class="btn btn-primary productSearch" name="productSearch" id="productSearch" value="Search">搜索</button>
              </form>
              <div id="productAutoComplete" class="productAutoComplete">
                <ul id="productAutoList" class="productAutoList">
                </ul>
              </div>
              <table class="table table-hover table-striped table-bordered" style="margin-top: 10px">
                <thead>
                <tr>
                  <th>宠物编号</th>
                  <th>宠物类别</th>
                  <th>宠物名称</th>
                  <th>简介</th>
                  <th class="text-center">操作</th>
                </tr>
                </thead>
                <tbody>

                <tr th:each="product:${productList}">
                  <td th:text="${product.getProductid()}">宠物编号</td>
                  <td th:text="${product.getCategory()}">宠物类别</td>
                  <td th:text="${product.getName()}">宠物名称</td>
                  <td ><img th:src="${product.getDescn()}" class="img"></td>
                  <td class="text-center">
                    <a class="btn btn-primary btn-sm productEditBtn" th:name="${product.getProductid()}">编辑</a>
                    <a class="btn btn-danger btn-sm"  th:href="@{/productDelete(productid=${product.getProductid()},category=${product.getCategory()},name=${product.getName()},descn=${product.getDescn()})}" >删除</a>
                  </td>
                </tr>
                </tbody>
              </table>
              <nav aria-label="Page navigation">
                <ul class="pagination pull-right">
                  <li>
                    <a href="#" aria-label="Previous">
                      <span aria-hidden="true">&laquo;</span>
                    </a>
                  </li>
                  <li><a href="#">1</a></li>
                  <li><a href="#">2</a></li>
                  <li><a href="#">3</a></li>
                  <li><a href="#">4</a></li>
                  <li><a href="#">5</a></li>
                  <li>
                    <a href="#" aria-label="Next">
                      <span aria-hidden="true">&raquo;</span>
                    </a>
                  </li>
                </ul>
              </nav>

          </div>
        </div>
      </div>
    </div>
      </div>
    <!--分割线-->
    <!--一开始要隐藏这个地方-->
    <form th:action="@{productAdd}" method="post" enctype="multipart/form-data">
      <div class="layui-form layuimini-form" id="orderAdd">
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物编号</label>
          <div class="layui-input-block">
            <input type="text" name="productid" lay-verify="required" lay-reqtext="用户名不能为空" placeholder="请输入用户名" autocomplete="off" class="layui-input">
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物类别</label>
          <div class="layui-input-block">
            <select name="category"  lay-verify="required" id="category" class="select">
              <option value="" >请选择</option>
              <option th:each="category:${categoryList}"
                      th:value="${category.getCatid()}"
                      th:text="${category.getCatid()}">
              </option>

            </select>
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物名称</label>
          <div class="layui-input-block">
            <input type="text" name="name" lay-verify="required" lay-reqtext="宠物名称不能为空" placeholder="请输入宠物名称" autocomplete="off" class="layui-input">
          </div>
        </div>

        <div class="layui-form-item">
          <label class="layui-form-label required">宠物描述</label>
          <div class="layui-input-block">
            <input type="file" name="file" value="上传图片" class="div2">
          </div>
        </div>

      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" type="submit">确认保存</button>
        </div>
      </div>
      </div>
    </form>

    <!--分割线2号-->
    <!--一开始要隐藏这个地方，这里是编辑的区域-->
    <form th:action="@{productEdit}" method="post" enctype="multipart/form-data">
      <div class="layui-form layuimini-form" id="productEdit">
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物编号</label>
          <div class="layui-input-block">
            <input type="text" name="editProductid" lay-verify="required" lay-reqtext="用户名不能为空" placeholder="请输入用户名" autocomplete="off" class="layui-input">
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物类别</label>
          <div class="layui-input-block">
            <select  name="editCategory" lay-verify="required" id="editCategory" class="select">
              <option>CAT</option>
              <option th:each="category:${categoryList}"
                      th:text="${category.getCatid()}" th:name="${category.getCatid()}" class="editoption"
                      >
              </option>
            </select>
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label required">宠物名称</label>
          <div class="layui-input-block">
            <input type="text" name="editName" lay-verify="required" lay-reqtext="宠物名称不能为空" placeholder="请输入宠物名称" autocomplete="off" class="layui-input">
          </div>
        </div>

        <div class="layui-form-item">
          <label class="layui-form-label required">宠物描述</label>
          <div class="layui-input-block">
          <input type="file" name="editFile" value="上传图片" class="div2">
          </div>
        </div>

      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" type="submit">确认保存</button>
        </div>
      </div>
      </div>
    </form>

</div>
</div>
</body>
</html>
